<p>
  7.css is a CSS framework for building interface components that look like Windows 7.
  It is built on top of the GUI backbone of <a href="https://github.com/botoxparty/XP.css">XP.css</a>,
  which is an extension of <a href="https://github.com/jdan/98.css">98.css</a>.
</p>

<div class="window active" style="margin: 32px; width: 250px">
  <div class="title-bar">
    <div class="title-bar-text">
      My First Program
    </div>

    <div class="title-bar-controls">
      <button aria-label="Minimize"></button>
      <button aria-label="Maximize"></button>
      <button aria-label="Close"></button>
    </div>
  </div>
  <div class="window-body has-space">
    <p>Hello, world!</p>
    <section style="display: flex; justify-content: flex-end; gap: 6px">
      <button class="default">OK</button>
      <button>Cancel</button>
    </section>
  </div>
</div>

<p>
  This framework relies on the usage of <strong>semantic HTML</strong>. To make a button, you'll need
  to use a <code>&lt;button&gt;</code>. Input elements require labels. Tabs rely on the <code>role="tab"</code>
  attribute.
  This page will guide you through that process, but accessibility is a primary goal of this project.
</p>

<p>
  You can override many of the styles of your elements while maintaining the appearance provided by
  this framework. Need more padding on your buttons? Go for it. Need to add some color to your input labels?
  Be our guest.
</p>

<p>
  <strong>This framework does not contain any JavaScript</strong>, it merely styles your HTML with some CSS.
  This means 7.css is compatible with your frontend framework of choice.
</p>